
/* 超小屏幕（手机，小于 768px） */
@media (max-width: 768px) {
    /* 头部 */
    #mo-header {

        height: 5.5rem /* 88/16 */;
        border-bottom: 3px solid #d75a45;
        line-height: 1;
        text-align: center;
    }
    #mo-header .container,
    #mo-header-navbar {
       height: 100%;
    }
    .mo-header-navbar {
        position: relative;
    }
    #mo-header .container .prev,
    #mo-header .container .home {
        content: '';
        position: absolute;
        top: 50%;
        transform: translate(0,-50%);
    }
    #mo-header .container .prev {
        left: .75rem /* 12/16 */;
    }
    #mo-header .container .home {
        right: .375rem /* 6/16 */;
    }
    #mo-header .container a img {
        height: 2.125rem /* 34/16 */;
    }
    #mo-footer .prev img {
        width: 1.1875rem /* 19/16 */;
    }
    #mo-footer .home img {
        width: 2.125rem /* 34/16 */;
    }
    #mo-header .container span {
        font-family: "HiraginoSansGB-W3";
        font-size: 1.875rem /* 30/16 */;
        color: #222222;
        line-height: 5.3125rem /* 85/16 */;

    }
    #mo-detail h2 {
        margin: 0;
        padding: 0;
        margin: .875rem /* 14/16 */ 0 1.5625rem /* 25/16 */;
        font-size: 2rem /* 32/16 */;
        color: #222222;
        line-height: 2.5625rem /* 41/16 */;
        display: -webkit-box;
        overflow: hidden;
        max-width: 37.5rem /* 600/16 */;
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }


    /* 躯干 */
    .mo-content-header {
        padding-bottom: 1.375rem /* 22/16 */;
        border-bottom: 1px solid #e6e6e6;
    }
    .mo-detail-keyword {
        position: relative;
        height: 1.75rem /* 28/16 */;
        margin-bottom: 1.5625rem /* 25/16 */;
        padding-left: 2.125rem /* 34/16 */;
        font-size: 0;
        overflow: hidden;   
    }
    .mo-detail-keyword img {
        position: absolute;
        height: 1.4375rem /* 23/16 */;
        top: 50%;
        left: 0;
        transform: translate(0,-50%);
    }
    .mo-detail-keyword a {
        display: inline-block;
        height: 1.75rem /* 28/16 */;
        margin: 0;
        margin-right: 1.25rem /* 20/16 */;
        padding: 0;
        padding: 0 8px 0 11px;
        border: none;
        border: 1px solid #cecece;
        font-size: 1.0625rem /* 17/16 */;
        color: #d75a45;
        text-align: center;
        line-height: 1.75rem /* 28/16 */;
        border-radius: 7px;
    }
    .mo-keyword-bottom {
        height: 1.5rem /* 24/16 */;
    }
    .mo-keyword-bottom .mo-detail-time {
        position: relative;
        height: 100%;
        padding-left: 2.25rem /* 36/16 */;
    }
    .mo-detail-time img {
        position: absolute;
        height: 100%;
        top: 50%;
        left: 0;
        transform: translate(0,-50%);
    }
    .mo-detail-time time {
        font-family: "SimHei";
        font-size: 1.5rem /* 24/16 */;
        color: #222222;
        line-height: 1.5rem /* 24/16 */;
    }
    .mo-keyword-bottom .mo-detail-reading {}
    .mo-detail-reading span {
        font-family: "SimHei";
        font-size: 1.375rem /* 22/16 */;
        color: #222222;
    }
    .mo-content {}
    .mo-content-article {
        padding-top: .6875rem /* 11/16 */;
    }
    /* 段落 */
    .mo-content-article p {
        margin: 0;
        font-family: "HiraginoSansGB-W3";
        font-size: 1.625rem /* 26/16 */;
        color: #303030;
        line-height: 2.75rem /* 44/16 */;
    }
    /* 插图 */
    .mo-content-article figure,
    .mo-co-video {
        height: 15.75rem /* 252/16 */;
    }
    .mo-content-article figure {
        margin: .9375rem /* 15/16 */ 0 1.1875rem /* 19/16 */;
    }
    .mo-content-article figure img {
        width: 100%;
        height: 100%;
    }
    /* 视频 */
    .mo-co-video {
        position: relative;
        margin: .5625rem /* 9/16 */ 0 .625rem /* 10/16 */;
    }
    .mo-co-video .mo-v-mask {
        position: absolute;
        width: 28rem /* 448/16 */;
        height: 100%;
        top: 0;
        left: 50%;
        background: rgba(0, 0, 0, .5);
        transform: translate(-50%,0);
    }
    .mo-co-video video {
        width: 100%;
        height: 100%;
        background: #000;
    }
    /* 点赞 */
    .mo-co-thumbsup {
        margin: .25rem /* 4/16 */ 0 2.3125rem /* 37/16 */;
    }
    .mo-co-thumbsup a {
        display: inline-block;
        position: relative;
        width: 5.75rem /* 92/16 */;
        height: 5.75rem /* 92/16 */;
        border: 1px solid #d75a45;
        border-radius: 100%;

    }
    
    .mo-co-thumbsup a img {
        position: absolute;
        height: 3rem /* 48/16 */;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }
    /* 推荐 */
    .mo-content-commend {
        
    }
    .mo-commend-header {
        padding: 0 2.4375rem /* 39/16 */;
    }
    /* 失效的原因找到了，
    去掉上一个选择器有效，那就是
    没用空格分开 */
    .mo-commend-header .row {
        display: flex;
        align-items: center;
        margin: 0;
        padding: 0;
    }
    .mo-commend-header .item {
        margin: 0;
        padding: 0;
    }
    .mo-commend-header .item:nth-of-type(1),
    .mo-commend-header .item:nth-of-type(3) {
        height: .1875rem /* 3/16 */;
        background-color: #d75a45;
    }
    .mo-commend-header .item:nth-of-type(2) {
        position: relative;
        font-family: "微软雅黑";
        font-size: 1.875rem /* 30/16 */;
        color: #252525;
        text-align: center;
    }
    .mo-commend-header .item:nth-of-type(2)::before,
    .mo-commend-header .item:nth-of-type(2)::after {
        content: '';
        display: block;
        position: absolute;
        width: .5625rem /* 9/16 */;
        height: .5625rem /* 9/16 */;
        top: 50%;
        border: .125rem /* 2/16 */ solid #d75a45;
        transform: translate(0,-50%);
        border-radius: 100%;

    }
    .mo-commend-header .item:nth-of-type(2)::before {
        left: 0;
    }
    .mo-commend-header .item:nth-of-type(2)::after {
        right: 0;
    }
    /* 轮播 */
    .mo-commend-swiper {
        height: 11.875rem /* 190/16 */;
        margin-top: 1.8125rem /* 29/16 */;
        padding-bottom: 1.8125rem /* 29/16 */;
        border-bottom: 1px solid #dfdfdf;
    }
    .mo-commend-swiper .swiper-container,
    .mo-commend-swiper .swiper-wrapper {
        width: 100%;
        height: 100%;
    }
    .mo-commend-swiper .swiper-slide {
        position: relative;
        height: 100%;
    }
    .mo-commend-swiper figure img {
        width: 100%;
        height: 100%;
    }
    .mo-commend-swiper figure figcaption {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 2.8125rem /* 45/16 */;
        padding: .5625rem /* 9/16 */ 0 0 .5625rem /* 9/16 */;
        background-color: rgba(0, 0, 0, .65);
    }
    .mo-commend-swiper figure figcaption span {
        font-family: "HiraginoSansGB-W3";
        font-size: 1.5rem /* 24/16 */;
        color: #fff;
        display: inline-block;
        max-width: 11.25rem /* 180/16 */;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    /* 评论 */
    .mo-content-comment {
        padding-top: 1.4375rem /* 23/16 */  ;
    }
    .mo-content-comment  .container {}
    .mo-content-comment h3 {
        margin-bottom: 2.0625rem /* 33/16 */;
        font-family: "HiraginoSansGB-W3";
        font-size: 1.625rem /* 26/16 */;
        color: #d75a45;
    }
    /* 媒体对象 */
    .mo-content-comment .media {
        height: 7.5rem /* 120/16 */;
        margin-bottom: 1.0625rem /* 17/16 */;
        border-bottom: 1px solid #dfdfdf;
    }
    .mo-content-comment .media-left {}
    .mo-content-comment .media-left img {
        height: 4.3125rem /* 69/16 */;
    }
    .mo-content-comment .media-body {}
    .mo-content-comment .media-body h4 {
        margin: 0;
        padding: 0;
        margin-bottom: 1.0625rem /* 17/16 */;
        font-family: "HiraginoSansGB-W3";
        font-size: 1.625rem /* 26/16 */;
        color: #222222;
        line-height: 1;
    }
    .mo-content-comment .media-body h4 time {
        margin-left: .8125rem /* 13/16 */;
        font-family: "iraginoSansGB-W3";
        font-size: 1rem /* 16/16 */;
        color: #bbbbbb;
        font-weight: normal;
        display: inline-block;
        max-width: 10rem /* 160/16 */;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;


    }
    .mo-content-comment .media-body p {
        font-family: "HiraginoSansGB-W3";
        font-size: 1.5rem /* 24/16 */;
        color: #222222;
        line-height: 1.875rem /* 30/16 */;
        display: -webkit-box;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
    .mo-content-comment .media:nth-last-of-type(1) {
        margin-bottom: 0;
    }
    /* 按钮 */
    .mo-content-btn {
        margin: 1.625rem /* 26/16 */ 0 2rem /* 32/16 */;
    }
    .mo-content-btn a {
        width: 26.6875rem /* 427/16 */;
        height: 3.375rem /* 54/16 */;
        margin: 0;
        padding: 0;
        background-color: #e0e0e0;
        font-family: "微软雅黑";
        font-size: 1.5rem /* 24/16 */;
        color: #4f4f4f;
        font-weight: lighter;
        text-align: center;
        line-height: 3.375rem /* 54/16 */;
        border-radius: 4px;
    }
    /* 脚部 */
    #mo-footer {
        height: 5.375rem /* 86/16 */;
        padding: .625rem /* 10/16 */ 0;
        border-top: 1px solid #dedee1;

    }
    #mo-footer .container,
    #mo-footer .container .row {
        height: 100%;
    }
    #mo-footer .container .row,
    #mo-footer .container .row div {
        margin: 0;
        padding: 0;
    }
    /* 否决了之前的方案，因为找不到准确的位置 */
    #mo-footer .container .row {

    }
    /* ~ 表示单独的一个
    * 表示含有其中的一个 */
    #mo-footer div[class*="col"] {
        font-family: "HiraginoSansGB-W3";
        font-size: 1.5rem /* 24/16 */;
        color: #666666;
        line-height: 1;
        text-align: center;
    }
    #mo-footer .prev {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        height: 100%;
        padding-left: 2.1875rem /* 35/16 */!important;
    }
    #mo-footer .prev img {
        height: 2.3125rem /* 37/16 */;
    }
    #mo-footer .item:nth-of-type(1) {
        position: relative;
        border-left: 1px solid #c7c7c7;
        border-right: 1px solid #c7c7c7;
    }
    #mo-footer .item-1,
    #mo-footer .item-2,
    #mo-footer .item-3,
    #mo-footer .item-4 {
        display: block;
        margin: 0 auto;
        margin-bottom: .75rem /* 12/16 */;
    }
    #mo-footer .item-1 {
        width: 1.875rem /* 30/16 */;
        height: 1.6875rem /* 27/16 */;
    }
    #mo-footer .item-2 {
        width: 1.8125rem /* 29/16 */;
        height: 1.8125rem /* 29/16 */;
    }
    #mo-footer .item-3 {
        width: 2.1875rem /* 35/16 */;
        height: 2rem /* 32/16 */;
    }
    #mo-footer .item-4 {
        width: 2.1875rem /* 35/16 */;
        height: 1.875rem /* 30/16 */;
    }
    /* 导航 */
    .mo-footer-navbar {
        position: absolute;
        width: 100%;
        height: 12.875rem /* 206/16 */;
        top: calc(-12.875rem /* 206/16 */ - .625rem /* 10/16 */);
        left: 0;
        margin: 0;
        padding: 0;
        padding: .75rem /* 12/16 */ 0 1.3125rem /* 21/16 */ 0;
        background-color: #fff;
        border: 1px solid #e7e7e7;
        box-shadow: 0 0 2px 0 rgba(91, 91, 91, .16);
        overflow: hidden;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;

    }
    .mo-footer-navbar li {
        position: relative;
        height: 1.375rem /* 22/16 */;
        margin: 0;
        padding: 0;
        padding-left: 2rem /* 32/16 */;
        line-height: 1;
        text-align: left !important;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;

    }
    .mo-footer-navbar li a {
        margin: 0;
        padding: 0;
        font-family: "HiraginoSansGB-W3";
        font-size: 1.375rem /* 22/16 */;
        color: #d75a45;
        line-height: 1.375rem /* 22/16 */;
    }
    .mo-footer-navbar li img {
        position: absolute;
        height: 100%;
        top: 50%;
        left: 0;
        transform: translate(0,-50%);
    }
    /* 评论 */
    .mo-footer-comment {

    }
    .mo-footer-mask {
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background: rgba(0, 0, 0, .5);
        z-index: 999;
    }
    .mo-comment-content {
        position: fixed;
        width: calc(100% - .9375rem /* 15/16 */ *2);
        height: 25.3125rem /* 405/16 */;
        top: 50%;
        left: 50%;
        padding: 1.625rem /* 26/16 */ 1.3125rem /* 21/16 */ 0 1.1875rem /* 19/16 */ !important;
        background: #fff;
        border-top: 6px solid #d75a45;
        font-size: 0;
        text-align: left;
        transform: translate(-50%,-50%);
        z-index: 9999;
    }
    .mo-comment-content label {
        display: block;
        margin: 0;
        padding: 0;
        margin-bottom: 1.5625rem /* 25/16 */;
        font-family: "HiraginoSansGB-W3";
        font-size: 2rem /* 32/16 */;
        color: #222222;
        font-weight: normal;
    }
    .mo-comment-content textarea,
    .mo-comment-content button[type="submit"] {
        width: 100%;
    } 
    .mo-comment-content textarea {
        height: 12.1875rem /* 195/16 */;
        margin: 0;
        padding: 0;
        padding: .8125rem /* 13/16 */ 0 0 .875rem /* 14/16 */;
        border: none;
        border: 1px solid #dfdfdf;
        font-family: "微软雅黑";
        font-size: 1.5rem /* 24/16 */;
        color: #969696;
        font-weight: lighter;
        outline: none;
        resize: none;
    }
    .mo-comment-content button[type="submit"] {
        display: block;
        height: 4.625rem /* 74/16 */;
        margin: 0;
        padding: 0;
        margin-top: 1.375rem /* 22/16 */;
        background-color: #d75a45;
        border: none;
        font-family: "微软雅黑";
        font-size: 1.875rem /* 30/16 */;
        color: #ffffff;
        line-height: 4.625rem /* 74/16 */;
        text-align: center;
        outline: none;
        border-radius: .25rem /* 4/16 */;
    }
    .mo-comment-content span {
        position: absolute;
        top: .8125rem /* 13/16 */;
        right: 1.25rem /* 20/16 */;
        font-size: 2rem /* 32/16 */;
        color: #d75a45;
    }








    
}
/* 小屏幕（平板，大于等于 768px） */
@media (min-width: 768px) and (max-width: 992px) {
    /* 头部 */
    #mo-header {

        height: 5.5rem /* 88/16 */;
        border-bottom: 3px solid #d75a45;
        line-height: 1;
        text-align: center;
    }
    #mo-header .container,
    #mo-header-navbar {
       height: 100%;
    }
    .mo-header-navbar {
        position: relative;
    }
    #mo-header .container .prev,
    #mo-header .container .home {
        content: '';
        position: absolute;
        top: 50%;
        transform: translate(0,-50%);
    }
    #mo-header .container .prev {
        left: .75rem /* 12/16 */;
    }
    #mo-header .container .home {
        right: .375rem /* 6/16 */;
    }
    #mo-header .container a img {
        height: 2.125rem /* 34/16 */;
    }
    #mo-footer .prev img {
        width: 1.1875rem /* 19/16 */;
    }
    #mo-footer .home img {
        width: 2.125rem /* 34/16 */;
    }
    #mo-header .container span {
        font-family: "HiraginoSansGB-W3";
        font-size: 1.875rem /* 30/16 */;
        color: #222222;
        line-height: 5.3125rem /* 85/16 */;

    }
    #mo-detail h2 {
        margin: 0;
        padding: 0;
        margin: .875rem /* 14/16 */ 0 1.5625rem /* 25/16 */;
        font-size: 2rem /* 32/16 */;
        color: #222222;
        line-height: 2.5625rem /* 41/16 */;
        display: -webkit-box;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }


    /* 躯干 */
    .mo-content-header {
        padding-bottom: 1.375rem /* 22/16 */;
        border-bottom: 1px solid #e6e6e6;
    }
    .mo-detail-keyword {
        position: relative;
        height: 1.75rem /* 28/16 */;
        margin-bottom: 1.5625rem /* 25/16 */;
        padding-left: 2.125rem /* 34/16 */;
        font-size: 0;
        overflow: hidden;   
    }
    .mo-detail-keyword img {
        position: absolute;
        height: 1.4375rem /* 23/16 */;
        top: 50%;
        left: 0;
        transform: translate(0,-50%);
    }
    .mo-detail-keyword a {
        display: inline-block;
        height: 1.75rem /* 28/16 */;
        margin: 0;
        margin-right: 1.25rem /* 20/16 */;
        padding: 0;
        padding: 0 8px 0 11px;
        border: none;
        border: 1px solid #cecece;
        font-size: 1.0625rem /* 17/16 */;
        color: #d75a45;
        text-align: center;
        line-height: 1.75rem /* 28/16 */;
        border-radius: 7px;
    }
    .mo-keyword-bottom {
        height: 1.5rem /* 24/16 */;
    }
    .mo-keyword-bottom .mo-detail-time {
        position: relative;
        height: 100%;
        padding-left: 2.25rem /* 36/16 */;
    }
    .mo-detail-time img {
        position: absolute;
        height: 100%;
        top: 50%;
        left: 0;
        transform: translate(0,-50%);
    }
    .mo-detail-time time {
        font-family: "SimHei";
        font-size: 1.5rem /* 24/16 */;
        color: #222222;
        line-height: 1.5rem /* 24/16 */;
    }
    .mo-keyword-bottom .mo-detail-reading {}
    .mo-detail-reading span {
        font-family: "SimHei";
        font-size: 1.375rem /* 22/16 */;
        color: #222222;
    }
    .mo-content {}
    .mo-content-article {
        padding-top: .6875rem /* 11/16 */;
    }
    /* 段落 */
    .mo-content-article p {
        margin: 0;
        font-family: "HiraginoSansGB-W3";
        font-size: 1.625rem /* 26/16 */;
        color: #303030;
        line-height: 2.75rem /* 44/16 */;
    }
    /* 插图 */
    .mo-content-article figure,
    .mo-co-video {
        height: 15.75rem /* 252/16 */;
    }
    .mo-content-article figure {
        margin: .9375rem /* 15/16 */ 0 1.1875rem /* 19/16 */;
    }
    .mo-content-article figure img {
        width: 100%;
        height: 100%;
    }
    /* 视频 */
    .mo-co-video {
        position: relative;
        margin: .5625rem /* 9/16 */ 0 .625rem /* 10/16 */;
    }
    .mo-co-video .mo-v-mask {
        position: absolute;
        width: 28rem /* 448/16 */;
        height: 100%;
        top: 0;
        left: 50%;
        background: rgba(0, 0, 0, .5);
        transform: translate(-50%,0);
    }
    .mo-co-video video {
        width: 100%;
        height: 100%;
        background: #000;
    }
    /* 点赞 */
    .mo-co-thumbsup {
        margin: .25rem /* 4/16 */ 0 2.3125rem /* 37/16 */;
    }
    .mo-co-thumbsup a {
        display: inline-block;
        position: relative;
        width: 5.75rem /* 92/16 */;
        height: 5.75rem /* 92/16 */;
        border: 1px solid #d75a45;
        border-radius: 100%;

    }
    
    .mo-co-thumbsup a img {
        position: absolute;
        height: 3rem /* 48/16 */;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }
    /* 推荐 */
    .mo-content-commend {
        
    }
    .mo-commend-header {
        padding: 0 2.4375rem /* 39/16 */;
    }
    /* 失效的原因找到了，
    去掉上一个选择器有效，那就是
    没用空格分开 */
    .mo-commend-header .row {
        display: flex;
        align-items: center;
        margin: 0;
        padding: 0;
    }
    .mo-commend-header .item {
        margin: 0;
        padding: 0;
    }
    .mo-commend-header .item:nth-of-type(1),
    .mo-commend-header .item:nth-of-type(3) {
        height: .1875rem /* 3/16 */;
        background-color: #d75a45;
    }
    .mo-commend-header .item:nth-of-type(2) {
        position: relative;
        font-family: "微软雅黑";
        font-size: 1.875rem /* 30/16 */;
        color: #252525;
        text-align: center;
    }
    .mo-commend-header .item:nth-of-type(2)::before,
    .mo-commend-header .item:nth-of-type(2)::after {
        content: '';
        display: block;
        position: absolute;
        width: .5625rem /* 9/16 */;
        height: .5625rem /* 9/16 */;
        top: 50%;
        border: .125rem /* 2/16 */ solid #d75a45;
        transform: translate(0,-50%);
        border-radius: 100%;

    }
    .mo-commend-header .item:nth-of-type(2)::before {
        left: 0;
    }
    .mo-commend-header .item:nth-of-type(2)::after {
        right: 0;
    }
    /* 轮播 */
    .mo-commend-swiper {
        height: 11.875rem /* 190/16 */;
        margin-top: 1.8125rem /* 29/16 */;
        padding-bottom: 1.8125rem /* 29/16 */;
        border-bottom: 1px solid #dfdfdf;
    }
    .mo-commend-swiper .swiper-container,
    .mo-commend-swiper .swiper-wrapper {
        width: 100%;
        height: 100%;
    }
    .mo-commend-swiper .swiper-slide {
        position: relative;
        height: 100%;
    }
    .mo-commend-swiper figure img {
        width: 100%;
        height: 100%;
    }
    .mo-commend-swiper figure figcaption {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 2.8125rem /* 45/16 */;
        padding: .5625rem /* 9/16 */ 0 0 .5625rem /* 9/16 */;
        background-color: rgba(0, 0, 0, .65);
    }
    .mo-commend-swiper figure figcaption span {
        font-family: "HiraginoSansGB-W3";
        font-size: 1.5rem /* 24/16 */;
        color: #fff;
        display: inline-block;
        max-width: 11.25rem /* 180/16 */;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    /* 评论 */
    .mo-content-comment {
        padding-top: 1.4375rem /* 23/16 */  ;
    }
    .mo-content-comment  .container {}
    .mo-content-comment h3 {
        margin-bottom: 2.0625rem /* 33/16 */;
        font-family: "HiraginoSansGB-W3";
        font-size: 1.625rem /* 26/16 */;
        color: #d75a45;
    }
    /* 媒体对象 */
    .mo-content-comment .media {
        height: 7.5rem /* 120/16 */;
        margin-bottom: 1.0625rem /* 17/16 */;
        border-bottom: 1px solid #dfdfdf;
    }
    .mo-content-comment .media-left {}
    .mo-content-comment .media-left img {
        height: 4.3125rem /* 69/16 */;
    }
    .mo-content-comment .media-body {}
    .mo-content-comment .media-body h4 {
        margin: 0;
        padding: 0;
        margin-bottom: 1.0625rem /* 17/16 */;
        font-family: "HiraginoSansGB-W3";
        font-size: 1.625rem /* 26/16 */;
        color: #222222;
        line-height: 1;
    }
    .mo-content-comment .media-body h4 time {
        margin-left: .8125rem /* 13/16 */;
        font-family: "iraginoSansGB-W3";
        font-size: 1rem /* 16/16 */;
        color: #bbbbbb;
        font-weight: normal;


    }
    .mo-content-comment .media-body p {
        font-family: "HiraginoSansGB-W3";
        font-size: 1.5rem /* 24/16 */;
        color: #222222;
        line-height: 1.875rem /* 30/16 */;
        display: -webkit-box;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
    .mo-content-comment .media:nth-last-of-type(1) {
        margin-bottom: 0;
    }
    /* 按钮 */
    .mo-content-btn {
        margin: 1.625rem /* 26/16 */ 0 2rem /* 32/16 */;
    }
    .mo-content-btn a {
        width: 26.6875rem /* 427/16 */;
        height: 3.375rem /* 54/16 */;
        margin: 0;
        padding: 0;
        background-color: #e0e0e0;
        font-family: "微软雅黑";
        font-size: 1.5rem /* 24/16 */;
        color: #4f4f4f;
        font-weight: lighter;
        text-align: center;
        line-height: 3.375rem /* 54/16 */;
        border-radius: 4px;
    }
    /* 脚部 */
    #mo-footer {
        height: 5.375rem /* 86/16 */;
        padding: .625rem /* 10/16 */ 0;
        border-top: 1px solid #dedee1;

    }
    #mo-footer .container,
    #mo-footer .container .row {
        height: 100%;
    }
    #mo-footer .container .row,
    #mo-footer .container .row div {
        margin: 0;
        padding: 0;
    }
    /* 否决了之前的方案，因为找不到准确的位置 */
    #mo-footer .container .row {

    }
    /* ~ 表示单独的一个
    * 表示含有其中的一个 */
    #mo-footer div[class*="col"] {
        font-family: "HiraginoSansGB-W3";
        font-size: 1.5rem /* 24/16 */;
        color: #666666;
        line-height: 1;
        text-align: center;
    }
    #mo-footer .prev {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        height: 100%;
        padding-left: 2.1875rem /* 35/16 */!important;
    }
    #mo-footer .prev img {
        height: 2.3125rem /* 37/16 */;
    }
    #mo-footer .item:nth-of-type(1) {
        position: relative;
        border-left: 1px solid #c7c7c7;
        border-right: 1px solid #c7c7c7;
    }
    #mo-footer .item-1,
    #mo-footer .item-2,
    #mo-footer .item-3,
    #mo-footer .item-4 {
        display: block;
        margin: 0 auto;
        margin-bottom: .75rem /* 12/16 */;
    }
    #mo-footer .item-1 {
        width: 1.875rem /* 30/16 */;
        height: 1.6875rem /* 27/16 */;
    }
    #mo-footer .item-2 {
        width: 1.8125rem /* 29/16 */;
        height: 1.8125rem /* 29/16 */;
    }
    #mo-footer .item-3 {
        width: 2.1875rem /* 35/16 */;
        height: 2rem /* 32/16 */;
    }
    #mo-footer .item-4 {
        width: 2.1875rem /* 35/16 */;
        height: 1.875rem /* 30/16 */;
    }
    /* 导航 */
    .mo-footer-navbar {
        position: absolute;
        width: 100%;
        height: 12.875rem /* 206/16 */;
        top: calc(-12.875rem /* 206/16 */ - .625rem /* 10/16 */);
        left: 0;
        margin: 0;
        padding: 0;
        padding: .75rem /* 12/16 */ 0 1.3125rem /* 21/16 */ 0;
        background-color: #fff;
        border: 1px solid #e7e7e7;
        box-shadow: 0 0 2px 0 rgba(91, 91, 91, .16);
        overflow: hidden;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;

    }
    .mo-footer-navbar li {
        position: relative;
        height: 1.375rem /* 22/16 */;
        margin: 0;
        padding: 0;
        padding-left: 2rem /* 32/16 */;
        line-height: 1;
        text-align: left !important;
        overflow: hidden;
        white-space: nowrap;

    }
    .mo-footer-navbar li a {
        margin: 0;
        padding: 0;
        font-family: "HiraginoSansGB-W3";
        font-size: 1.375rem /* 22/16 */;
        color: #d75a45;
        line-height: 1.375rem /* 22/16 */;
    }
    .mo-footer-navbar li img {
        position: absolute;
        height: 100%;
        top: 50%;
        left: 0;
        transform: translate(0,-50%);
    }
    /* 评论 */
    .mo-footer-comment {

    }
    .mo-footer-mask {
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background: rgba(0, 0, 0, .5);
        z-index: 999;
    }
    .mo-comment-content {
        position: fixed;
        width: calc(100% - .9375rem /* 15/16 */ *2);
        height: 25.3125rem /* 405/16 */;
        top: 50%;
        left: 50%;
        padding: 1.625rem /* 26/16 */ 1.3125rem /* 21/16 */ 0 1.1875rem /* 19/16 */ !important;
        background: #fff;
        border-top: 6px solid #d75a45;
        font-size: 0;
        text-align: left;
        transform: translate(-50%,-50%);
        z-index: 9999;
    }
    .mo-comment-content label {
        display: block;
        margin: 0;
        padding: 0;
        margin-bottom: 1.5625rem /* 25/16 */;
        font-family: "HiraginoSansGB-W3";
        font-size: 2rem /* 32/16 */;
        color: #222222;
        font-weight: normal;
    }
    .mo-comment-content textarea,
    .mo-comment-content button[type="submit"] {
        width: 100%;
    } 
    .mo-comment-content textarea {
        height: 12.1875rem /* 195/16 */;
        margin: 0;
        padding: 0;
        padding: .8125rem /* 13/16 */ 0 0 .875rem /* 14/16 */;
        border: none;
        border: 1px solid #dfdfdf;
        font-family: "微软雅黑";
        font-size: 1.5rem /* 24/16 */;
        color: #969696;
        font-weight: lighter;
        outline: none;
        resize: none;
    }
    .mo-comment-content button[type="submit"] {
        display: block;
        height: 4.625rem /* 74/16 */;
        margin: 0;
        padding: 0;
        margin-top: 1.375rem /* 22/16 */;
        background-color: #d75a45;
        border: none;
        font-family: "微软雅黑";
        font-size: 1.875rem /* 30/16 */;
        color: #ffffff;
        line-height: 4.625rem /* 74/16 */;
        text-align: center;
        outline: none;
        border-radius: .25rem /* 4/16 */;
    }
    .mo-comment-content span {
        position: absolute;
        top: .8125rem /* 13/16 */;
        right: 1.25rem /* 20/16 */;
        font-size: 2rem /* 32/16 */;
        color: #d75a45;
    }
}
 /* 中等屏幕（桌面显示器，大于等于 992px） */
@media (min-width: 992px) and (max-width: 1200px) {
    /* 头部 */
    #header {
        
    }
    #navbar {
        height: 58px;
    }
    #navbar .container,
    #navbar .container .navbar-header {
        height: 100%;
    }
    #navbar {
        padding: 0;
    }
    #navbar .container .navbar-header {
        padding: 10px 0 0 18px;
    }
    .navbar-header a {
        display: inline-block;
        padding: 0;
        font-size: 40px;
        color: #d75a45;
        font-weight: bold;
        line-height: 1;
    }
    #navbar ul {
        margin: 0;
        padding: 0;
        padding: 20px 14px 0 0;
    }
    #navbar ul li  {
        position: relative;
        margin-right: 43px;
        padding-left: 17px;
        line-height: 1;


    }
    #navbar ul li:nth-last-of-type(1) {
        margin-right: 0 !important;
        padding-left: 13px;
    }

    #navbar ul li img {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translate(0,-50%);
    }

    #navbar ul li a {
        position: relative;
        display: inline-block;
        padding: 0;
        font-size: 12px;
        color: #000;
        line-height: 1;

    }
    #subnavbar {
        height: 50px;
        background: #d75a45;
    }
    #subnavbar .container,
    #subnavbar .container ul {
        height: 100%;
    }
    #subnavbar .container ul {
        padding: 14px 0 0 20px;
    }
    #subnavbar ul li {
        padding: 0 43px 0 41px;
    }
    #subnavbar ul li a {
        display: inline-block;
        padding: 0;
        font-size: 18px;
        color: #fff;
    }
    #subnavbar ul li:nth-of-type(1) {
        padding-left: 0 !important;
    }

    #subnavbar ul li::after {
        content: '';
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 1px;
        height: 20px;
        background-color: #fff;
    }
    #subnavbar ul li:nth-last-of-type(1)::after {
        display: none;
    }
    #subnavbar .container form {
        margin: 0;
        padding: 0;
        padding: 8px 24px 0 0;
    }

    /* 修改样式，参考nyaa样式 */
    .input-group {
        width: 303px;
    }
    .input-group input {
        padding: 0;
        border: 1px solid #d3d3d3;
        border-right: none;
        color: #aeabab;
        text-indent: 9px;
        border-radius: 0;
        
    }
    .input-group input::-webkit-input-placeholder {
        color: #aeabab;
    }
    .input-group-btn {
        width: 56px !important;
        height: 34px;
    }
    .btn-primary {
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        background-color: #f8674f !important;
        border: none;
        border-radius: 0;
    }
    /* 脚部 */
    #footer {
        

    }
    /* 脚部主要内容 */
    #footer .footer-content {
        height: calc(252px - 76px);
        background-color: #d75a45;
    }
    #footer .footer-content .container,
    #footer .footer-content .container .row {
        height: 100%;
    }
    #footer .footer-content .row div[class*="col-"]  {
        height: 100%;
    }

    #footer .footer-content  h3 {
        margin: 0;
        padding: 0;
        padding-top: 29px;
        font-size: 18px;
        color: #fff;
        font-weight: normal;
    }
    #footer .footer-about p,
    #footer .footer-contacts address,
    #footer .footer-contacts address a {

        font-size: 12px;
        color: #fefefe;
        line-height: 24px;
    }
    #footer .footer-about h3::after,
    #footer .footer-contacts h3::after {
        content:  '';
        display: block;
        width: 405px;
        height: 1px;
        margin: 7px 0 6px;
        background-color: #fff;
    }
    #footer .footer-contacts h3::after{
       width: 240px;
    }
    /* 二维码 */
    #footer .footer-wechat {
        padding-top: 23px;
    }
    #footer .footer-wechat img {
        width: 104px;
        height: 104px;
    }
    #footer .footer-wechat figcaption {
        width: 104px;
        margin-top: 15px;
        font-size: 14px;
        color: #ffffff;
        text-align: center;
    }


    /* 脚部的底部 */
    #footer .footer-bottom {
        height: 76px;
        background-color: #41332a;
    }
    #footer .footer-bottom .container {
        height: 100%;
    }
    #footer .footer-bottom p,
    #footer .footer-bottom p a
     {
        margin: 0;
        padding: 0;
        font-size: 12px;
        color: #fff;
        line-height: 1;
    }
    #footer .footer-bottom p:nth-of-type(1) {
        margin: 21px 0 16px;
    }
    #footer .footer-bottom p:nth-of-type(1) a {
        position: relative;
        padding: 0 24px 0 28px;
    }
    #footer .footer-bottom p:nth-of-type(1) .first {
        padding-left: 0;
    }
    #footer .footer-bottom p:nth-of-type(1) a::after {
        content: '';
        display: block;
        position: absolute;
        width: 2px;
        height: 13px;
        top: 0;
        right: 0;
        background-color: #cfccca;
    }
    #footer .footer-bottom p:nth-of-type(1) .last::after {
        display: none;
    }
    /* 躯干 */
    .detail-content {
        line-height: 1;
    }
    /* 文章标题 */
    .detail-content h1 {
        margin: 0;
        margin: 27px 0 26px;
        font-family: "微软雅黑";
        font-size: 26px;
        color: #191919;
        line-height: 37px;
        font-weight: bolder;
    }
    /* 关键词 */
    .detail-content .detail-keyword {
        position: relative;
        padding-left: 25px;
        margin: 0;
        margin-bottom: 24px;
        font-size: 0;
    }
    .detail-content .detail-keyword img {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translate(0,-50%);
    }
    .detail-content .detail-keyword a {
        display: inline-block;
        width: 59px;
        height: 19px;
        margin: 0;
        margin-right: 10px;
        padding: 0;
        border: 1px solid #cecece;
        border-radius: 7px;
        font-size: 12px;
        color: #d75a45;
    }
    /* 关键词底部 */
    .detail-content .detail-keyword-bottom {
        height: 33px;
    }
    .detail-keyword-bottom .detail-time {
        position: relative;
        padding-left: 24px;
    }
    .detail-keyword-bottom .detail-time img {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translate(0,-50%);
    }
    .detail-keyword-bottom .detail-time time {
        font-size: 15px;
        color: #4a4a4a;
    }
    .detail-keyword-bottom .detail-toolbar {

        font-size: 0;
    }

    .detail-keyword-bottom .detail-toolbar span {
        margin-right: 21px;
        font-size: 17px;
        color: #4a4a4a;
        vertical-align: middle;
    }
    .detail-keyword-bottom .detail-toolbar .detail-btn-group {
        display: inline-block;
        position: relative;
        padding-left: 29px;
        margin-right: 25px;

    }
    .detail-keyword-bottom .detail-toolbar .detail-btn-group:nth-last-of-type(1) {
        margin-right: 0;
    }
    .detail-keyword-bottom .detail-btn-group img {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translate(0,-50%);
    }
    .detail-keyword-bottom .detail-btn-group a {
        display: inline-block;
        margin: 0;
        padding: 0;
        border: none;
        font-size: 16px;
        color: #222222;
    }
    /* 主要内容 */
    .detail-article {
        padding-top: 11px;
        border-top: 1px solid #e6e6e6;
    }
    .detail-article p {
        margin: 0;
        font-family: "微软雅黑";
        font-size: 16px;
        color: #222222;
        line-height: 29px;
        font-weight: lighter;
    }
    /* 文章插图 */
    .detail-article figure img {
        width: 100%;
        height: 100%;
    }
    /* 文章视频 */
    .detail-article-video {
        position: relative;
        height: 377px;
        margin: 24px 0;
    }
    .detail-article-video .detail-video-mask {
        position: absolute;
        width: 670px;
        height: 100%;
        top: 0;
        left: 50%;
        background-color: rgba(0, 0, 0, .5);
        transform: translate(-50%,0);
    }
    .detail-article-video video {
        width: 100%;
        height: 100%;
        background: #000;
    }
    /* 文章段落 */
    .detail-article p:nth-last-of-type(1) {
        margin: 28px 0 52px;
        font-size: 0;
    }

    .detail-article p a {
        display: inline-block;
        width: 90px;
        height: 90px;
        padding-top: 69px;
        background-color: #d9d7d7;
        background-image: url(../image/detail/未标题-5.png);
        background-repeat: no-repeat;
        background-position: center center;
        border: none;
        font-family: "微软雅黑";
        font-size: 14px;
        color: #ffffff;
        border-radius: 90px;
        
    }

    .detail-article p a+a {
        margin-left: 20px;
        
    }
    .detail-article p a[class$="active"],
    .detail-article p a:active,
    .detail-article p a:hover,
    .detail-article p a:focus {
        background-color: #d75a45!important;
        background-image: url(../image/detail/未标题-5.png)!important;
        color: #ffffff!important;
    }
    .detail-commend {}
    /* 推荐阅读 */
    .detail-commend-header {
        margin-bottom: 25px;
    }
    .detail-commend-header .row {
        display: flex;
        align-items: center;
        margin: 0;
        padding: 0;
        padding: 0 15px;
    }
    .detail-commend-item {
        margin: 0;
        padding: 0;
    }
    .detail-commend-item:nth-of-type(1),
    .detail-commend-item:nth-of-type(3) {
        height: 1px;
        background-color: #d75a45;
    }
    .detail-commend-item:nth-of-type(2) {
        position: relative;
        font-size: 23px;
        color: #252525;
        text-align: center;
    }
    .detail-commend-item:nth-of-type(2)::before,
    .detail-commend-item:nth-of-type(2)::after {
        content: '';
        display: block;
        position: absolute;
        top: 50%;
        width: 9px;
        height: 9px;
        border: 2px solid #d75a45;
        border-radius: 9px;
        transform: translate(0,-50%);
    }
    .detail-commend-item:nth-of-type(2)::before {
        left: 0;
    }
    .detail-commend-item:nth-of-type(2)::after {
        right: 0;
    }
    /* 轮播图 */
    .detail-commend-swiper {
        height: 200px;
        margin-bottom: 53px;
    }
    .detail-commend-swiper .swiper-container,
    .detail-commend-swiper .swiper-wrapper,
    .detail-commend-swiper .swiper-slide  img {
        width: 100%;
        height: 100%;
    }
    .detail-commend-swiper .swiper-slide {
        position: relative;
        height: 100%;
    }
    .detail-commend-swiper .swiper-slide figcaption {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 53px;
        padding: 19px 0 0 12px;
        background: rgba(0, 0, 0, .65);
    }
    .detail-commend-swiper .swiper-slide figcaption span {
        font-size: 16px;
        color: #fff;
        overflow: hidden;
        display: inline-block;
        max-width: 210px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    /* 评论顶部 */
    .detail-comment {}
    .detail-comment-textarea {}
    /* 文本框 */
    .detail-comment-textarea label,
    .detail-comment-textarea textarea {
        display: block;
    }
    .detail-comment-textarea label {
        margin: 0;
        margin-bottom: 25px;
        font-family: "微软雅黑";
        font-size: 22px;
        color: #d75a45;
        font-weight: bold;
    }
    .detail-comment-textarea textarea {
        width: 100%;
        height: 153px;
        padding: 14px 0 0 13px;
        border: none;
        border: 1px solid #dfdfdf;
        resize: none;
        outline: none;
        
    }
    .detail-comment-textarea textarea,
    .detail-comment-textarea textarea::-webkit-input-placeholder,
    .detail-textarea-bottom span {
        font-size: 16px;
        color: #969696;
    }
    /* 文本框底部 */
    .detail-textarea-bottom {
        height: 64px;
        margin: 11px 0 28px;
        border-bottom: 1px solid #dfdfdf;
    }
    .detail-textarea-bottom a {
        width: 92px;
        height: 40px;
        margin: 0;
        padding: 0;
        border: none;
        background-color: #d75a45;
        font-family: "微软雅黑";
        font-size: 20px;
        color: #ffffff;
        text-align: center;
        line-height: 40px;
        border-radius: 4px;
    }
    .detail-textarea-bottom a:focus,
    .detail-textarea-bottom a:hover,
    .detail-textarea-bottom a:active {
        background-color: #d75a45 !important;
        font-size: 20px !important;
        color: #ffffff !important;
    }
    /* 评论内容 */
    .detail-comment-content {}
    .detail-comment-content h3 {
        margin-bottom: 30px;
        font-size: 20px;
        color: #d75a45;
    }
    .detail-comment-content .media {
        border-bottom: 1px solid #dfdfdf;
    }
    .detail-comment-content .media+.media {
        margin-top: 20px;
    }
    .detail-comment-content .media h4 {
        margin: 0;
        font-size: 16px;
        color: #222222;
    }
    /* 和html页面的类名不一样，就算报错也看不出来 */
    .detail-comment-content .media h4 small,
    .detail-comment-content .media h4 time {
        margin-left: 15px;
        font-size: 14px !important;
        color: #bbbbbb !important;
    }
    .detail-comment-content .media p {
        margin-top: 11px;
        font-size: 14px;
        color: #222222;
        font-weight: lighter;
        line-height: 24px;
        display: -webkit-box;
        overflow: hidden;
        max-width: 882px;
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
    .detail-comment-content .media h4,
    .detail-comment-content .media small,
    .detail-comment-content .media h4 time,
    .detail-comment-content .media p {
        font-family: "微软雅黑";
    }
    .detail-comment-bottom {
        margin: 0;
        margin: 48px 0 63px;
    }
    /* 评论底部 */
    .detail-comment-bottom a {
        width: 427px;
        height: 54px;
        margin: 0;
        padding: 0;
        background-color: #e0e0e0;
        border: none;
        font-size: 21px;
        color: #4f4f4f;
        text-align: center;
        line-height: 54px;
        border-radius: 4px;
    }
}
 /* 大屏幕（大桌面显示器，大于等于 1200px） */
@media (min-width: 1200px) {
    /* 头部 */
    #header {
        
    }
    #navbar {
        height: 58px;
    }
    #navbar .container,
    #navbar .container .navbar-header {
        height: 100%;
    }
    #navbar {
        padding: 0;
    }
    #navbar .container .navbar-header {
        padding: 10px 0 0 18px;
    }
    .navbar-header a {
        display: inline-block;
        padding: 0;
        font-size: 40px;
        color: #d75a45;
        font-weight: bold;
        line-height: 1;
    }
    #navbar ul {
        margin: 0;
        padding: 0;
        padding: 20px 14px 0 0;
    }
    #navbar ul li  {
        position: relative;
        margin-right: 43px;
        padding-left: 17px;
        line-height: 1;


    }
    #navbar ul li:nth-last-of-type(1) {
        margin-right: 0 !important;
        padding-left: 13px;
    }

    #navbar ul li img {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translate(0,-50%);
    }

    #navbar ul li a {
        position: relative;
        display: inline-block;
        padding: 0;
        font-size: 12px;
        color: #000;
        line-height: 1;

    }
    #subnavbar {
        height: 50px;
        background: #d75a45;
    }
    #subnavbar .container,
    #subnavbar .container ul {
        height: 100%;
    }
    #subnavbar .container ul {
        padding: 14px 0 0 20px;
    }
    #subnavbar ul li {
        padding: 0 43px 0 41px;
    }
    #subnavbar ul li a {
        display: inline-block;
        padding: 0;
        font-size: 18px;
        color: #fff;
    }
    #subnavbar ul li:nth-of-type(1) {
        padding-left: 0 !important;
    }

    #subnavbar ul li::after {
        content: '';
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 1px;
        height: 20px;
        background-color: #fff;
    }
    #subnavbar ul li:nth-last-of-type(1)::after {
        display: none;
    }
    #subnavbar .container form {
        margin: 0;
        padding: 0;
        padding: 8px 24px 0 0;
    }

    /* 修改样式，参考nyaa样式 */
    .input-group {
        width: 303px;
    }
    .input-group input {
        padding: 0;
        border: 1px solid #d3d3d3;
        border-right: none;
        color: #aeabab;
        text-indent: 9px;
        border-radius: 0;
        
    }
    .input-group input::-webkit-input-placeholder {
        color: #aeabab;
    }
    .input-group-btn {
        width: 56px !important;
        height: 34px;
    }
    .btn-primary {
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        background-color: #f8674f !important;
        border: none;
        border-radius: 0;
    }
    /* 脚部 */
    #footer {
        

    }
    /* 脚部主要内容 */
    #footer .footer-content {
        height: calc(252px - 76px);
        background-color: #d75a45;
    }
    #footer .footer-content .container,
    #footer .footer-content .container .row {
        height: 100%;
    }
    #footer .footer-content .row div[class*="col-"]  {
        height: 100%;
    }

    #footer .footer-content  h3 {
        margin: 0;
        padding: 0;
        padding-top: 29px;
        font-size: 18px;
        color: #fff;
        font-weight: normal;
    }
    #footer .footer-about  p,
    #footer .footer-contacts  address,
    #footer .footer-contacts address a {

        font-size: 12px;
        color: #fefefe;
        line-height: 24px;
    }
    #footer .footer-about h3::after,
    #footer .footer-contacts h3::after {
        content:  '';
        display: block;
        width: 405px;
        height: 1px;
        margin: 7px 0 6px;
        background-color: #fff;
    }
    #footer .footer-contacts h3::after{
       width: 240px;
    }
    /* 二维码 */
    #footer .footer-wechat {
        padding-top: 23px;
    }
    #footer .footer-wechat img {
        width: 104px;
        height: 104px;
    }
    #footer .footer-wechat figcaption {
        width: 104px;
        margin-top: 15px;
        font-size: 14px;
        color: #ffffff;
        text-align: center;
    }


    /* 脚部的底部 */
    #footer .footer-bottom {
        height: 76px;
        background-color: #41332a;
    }
    #footer .footer-bottom .container {
        height: 100%;
    }
    #footer .footer-bottom p,
    #footer .footer-bottom p a
     {
        margin: 0;
        padding: 0;
        font-size: 12px;
        color: #fff;
        line-height: 1;
    }
    #footer .footer-bottom p:nth-of-type(1) {
        margin: 21px 0 16px;
    }
    #footer .footer-bottom p:nth-of-type(1) a {
        position: relative;
        padding: 0 24px 0 28px;
    }
    #footer .footer-bottom p:nth-of-type(1) .first {
        padding-left: 0;
    }
    #footer .footer-bottom p:nth-of-type(1) a::after {
        content: '';
        display: block;
        position: absolute;
        width: 2px;
        height: 13px;
        top: 0;
        right: 0;
        background-color: #cfccca;
    }
    #footer .footer-bottom p:nth-of-type(1) .last::after {
        display: none;
    }


    /* 躯干 */
    .detail-content {
        line-height: 1;
    }
    /* 文章标题 */
    .detail-content h1 {
        margin: 0;
        margin: 27px 0 26px;
        font-family: "微软雅黑";
        font-size: 26px;
        color: #191919;
        line-height: 37px;
        font-weight: bolder;
    }
    /* 关键词 */
    .detail-content .detail-keyword {
        position: relative;
        padding-left: 25px;
        margin: 0;
        margin-bottom: 24px;
        font-size: 0;
    }
    .detail-content .detail-keyword img {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translate(0,-50%);
    }
    .detail-content .detail-keyword a {
        display: inline-block;
        width: 59px;
        height: 19px;
        margin: 0;
        margin-right: 10px;
        padding: 0;
        border: 1px solid #cecece;
        border-radius: 7px;
        font-size: 12px;
        color: #d75a45;
    }
    /* 关键词底部 */
    .detail-content .detail-keyword-bottom {
        height: 33px;
    }
    .detail-keyword-bottom .detail-time {
        position: relative;
        padding-left: 24px;
    }
    .detail-keyword-bottom .detail-time img {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translate(0,-50%);
    }
    .detail-keyword-bottom .detail-time time {
        font-size: 15px;
        color: #4a4a4a;
    }
    .detail-keyword-bottom .detail-toolbar {

        font-size: 0;
    }

    .detail-keyword-bottom .detail-toolbar span {
        margin-right: 21px;
        font-size: 17px;
        color: #4a4a4a;
        vertical-align: middle;
    }
    .detail-keyword-bottom .detail-toolbar .detail-btn-group {
        display: inline-block;
        position: relative;
        padding-left: 29px;
        margin-right: 25px;

    }
    .detail-keyword-bottom .detail-toolbar .detail-btn-group:nth-last-of-type(1) {
        margin-right: 0;
    }
    .detail-keyword-bottom .detail-btn-group img {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translate(0,-50%);
    }
    .detail-keyword-bottom .detail-btn-group a {
        display: inline-block;
        margin: 0;
        padding: 0;
        border: none;
        font-size: 16px;
        color: #222222;
    }
    /* 主要内容 */
    .detail-article {
        padding-top: 11px;
        border-top: 1px solid #e6e6e6;
    }
    .detail-article p {
        margin: 0;
        font-family: "微软雅黑";
        font-size: 16px;
        color: #222222;
        line-height: 29px;
        font-weight: lighter;
    }
    .detail-article figure {
        height: 377px;
        margin: 25px 0 24px;
    }
    /* 文章插图 */
    .detail-article figure img {
        width: 100%;
        height: 100%;
    }
    /* 文章视频 */
    .detail-article-video {
        position: relative;
        height: 377px;
        margin: 24px 0;
    }
    .detail-article-video .detail-video-mask {
        position: absolute;
        width: 670px;
        height: 100%;
        top: 0;
        left: 50%;
        background-color: rgba(0, 0, 0, .5);
        transform: translate(-50%,0);
    }
    .detail-article-video video {
        width: 100%;
        height: 100%;
        background: #000;
    }
    /* 文章段落 */
    .detail-article p:nth-last-of-type(1) {
        margin: 28px 0 52px;
        font-size: 0;
    }

    .detail-article p a {
        display: inline-block;
        width: 90px;
        height: 90px;
        padding-top: 69px;
        background-color: #d9d7d7;
        background-image: url(../image/detail/未标题-5.png);
        background-repeat: no-repeat;
        background-position: center center;
        border: none;
        font-family: "微软雅黑";
        font-size: 14px;
        color: #ffffff;
        border-radius: 90px;
        
    }

    .detail-article p a+a {
        margin-left: 20px;
        
    }
    .detail-article p a[class$="active"],
    .detail-article p a:active,
    .detail-article p a:hover,
    .detail-article p a:focus {
        background-color: #d75a45!important;
        background-image: url(../image/detail/未标题-5.png)!important;
        color: #ffffff!important;
    }
    .detail-commend {}
    /* 推荐阅读 */
    .detail-commend-header {
        margin-bottom: 25px;
    }
    .detail-commend-header .row {
        display: flex;
        align-items: center;
        margin: 0;
        padding: 0;
        padding: 0 15px;
    }
    .detail-commend-item {
        margin: 0;
        padding: 0;
    }
    .detail-commend-item:nth-of-type(1),
    .detail-commend-item:nth-of-type(3) {
        height: 1px;
        background-color: #d75a45;
    }
    .detail-commend-item:nth-of-type(2) {
        position: relative;
        font-size: 23px;
        color: #252525;
        text-align: center;
    }
    .detail-commend-item:nth-of-type(2)::before,
    .detail-commend-item:nth-of-type(2)::after {
        content: '';
        display: block;
        position: absolute;
        top: 50%;
        width: 9px;
        height: 9px;
        border: 2px solid #d75a45;
        border-radius: 9px;
        transform: translate(0,-50%);
    }
    .detail-commend-item:nth-of-type(2)::before {
        left: 0;
    }
    .detail-commend-item:nth-of-type(2)::after {
        right: 0;
    }
    /* 轮播图 */
    .detail-commend-swiper {
        height: 200px;
        margin-bottom: 53px;
    }
    .detail-commend-swiper .swiper-container,
    .detail-commend-swiper .swiper-wrapper,
    .detail-commend-swiper .swiper-slide  img {
        width: 100%;
        height: 100%;
    }
    .detail-commend-swiper .swiper-slide {
        position: relative;
        height: 100%;
    }
    .detail-commend-swiper .swiper-slide figcaption {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 53px;
        padding: 19px 0 0 12px;
        background: rgba(0, 0, 0, .65);
    }
    .detail-commend-swiper .swiper-slide figcaption span {
        font-size: 16px;
        color: #fff;
        overflow: hidden;
        display: inline-block;
        max-width: 210px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    /* 评论顶部 */
    .detail-comment {}
    .detail-comment-textarea {}
    /* 文本框 */
    .detail-comment-textarea label,
    .detail-comment-textarea textarea {
        display: block;
    }
    .detail-comment-textarea label {
        margin: 0;
        margin-bottom: 25px;
        font-family: "微软雅黑";
        font-size: 22px;
        color: #d75a45;
        font-weight: bold;
    }
    .detail-comment-textarea textarea {
        width: 100%;
        height: 153px;
        padding: 14px 0 0 13px;
        border: none;
        border: 1px solid #dfdfdf;
        resize: none;
        outline: none;
        
    }
    .detail-comment-textarea textarea,
    .detail-comment-textarea textarea::-webkit-input-placeholder,
    .detail-textarea-bottom span {
        font-size: 16px;
        color: #969696;
    }
    /* 文本框底部 */
    .detail-textarea-bottom {
        height: 64px;
        margin: 11px 0 28px;
        border-bottom: 1px solid #dfdfdf;
    }
    .detail-textarea-bottom a {
        width: 92px;
        height: 40px;
        margin: 0;
        padding: 0;
        border: none;
        background-color: #d75a45;
        font-family: "微软雅黑";
        font-size: 20px;
        color: #ffffff;
        text-align: center;
        line-height: 40px;
        border-radius: 4px;
    }
    .detail-textarea-bottom a:focus,
    .detail-textarea-bottom a:hover,
    .detail-textarea-bottom a:active {
        background-color: #d75a45 !important;
        font-size: 20px !important;
        color: #ffffff !important;
    }
    /* 评论内容 */
    .detail-comment-content {}
    .detail-comment-content h3 {
        margin-bottom: 30px;
        font-size: 20px;
        color: #d75a45;
    }
    .detail-comment-content .media {
        border-bottom: 1px solid #dfdfdf;
    }
    .detail-comment-content .media+.media {
        margin-top: 20px;
    }
    .detail-comment-content .media h4 {
        margin: 0;
        font-size: 16px;
        color: #222222;
    }
    /* 和html页面的类名不一样，就算报错也看不出来 */
    .detail-comment-content .media h4 small,
    .detail-comment-content .media h4 time {
        margin-left: 15px;
        font-size: 14px !important;
        color: #bbbbbb !important;
    }
    .detail-comment-content .media p {
        margin-top: 11px;
        font-size: 14px;
        color: #222222;
        font-weight: lighter;
        line-height: 24px;
        display: -webkit-box;
        overflow: hidden;
        max-width: 882px;
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
    .detail-comment-content .media h4,
    .detail-comment-content .media small,
    .detail-comment-content .media time,
    .detail-comment-content .media p {
        font-family: "微软雅黑";
    }
    .detail-comment-bottom {
        margin: 0;
        margin: 48px 0 63px;
    }
    /* 评论底部 */
    .detail-comment-bottom a {
        width: 427px;
        height: 54px;
        margin: 0;
        padding: 0;
        background-color: #e0e0e0;
        border: none;
        font-size: 21px;
        color: #4f4f4f;
        text-align: center;
        line-height: 54px;
        border-radius: 4px;
    }
    

}